<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>蜜读</title>
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/aui.css" />
		<link rel="stylesheet" type="text/css" href="css/iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="css/swiper-3.4.2.min.css" />
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
		<script src="js/art-template.js" type="text/javascript" charset="utf-8"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="js/wxrem.js" type="text/javascript" charset="utf-8"></script>
		<!--<script src="//s.url.cn/qqun/qun/qqweb/m/qun/confession/js/vconsole.min.js"></script>-->
		<script type="text/javascript">
			document.writeln("<script type=\"text/javascript\" src=\"js/common.js?"+ Math.random() + "\"></scr"+"ipt>");
		</script>
		<style>
			#footer {
				background-color: #f2f2f2;
			}

			#footer ul li {
				background: url() no-repeat center 5px;
				text-align: center;
				color: #666666;
			}

			#footer ul li.active {
				color: #282828;
			}

			#footer ul li:nth-child(1) {
				background-image: url(icon/home.png);
			}

			#footer ul li:nth-child(2) {
				background-image: url(icon/buy.png);
			}

			#footer ul li:nth-child(3) {
				background-image: url(icon/me.png);
			}

			#footer ul li:nth-child(1).active {
				background-image: url(icon/home_hover.png);
			}

			#footer ul li:nth-child(2).active {
				background-image: url(icon/buy_hover.png);
			}

			#footer ul li:nth-child(3).active {
				background-image: url(icon/me_hover.png);
			}

			.swiper-container {
				width: 100%;
				height: 12rem;
				/*top: 12rem;*/
			}

			#tabbar {
				text-align: center;
				padding: 1.56rem 0 0 0;
				margin-left: 1.04rem;
				height: auto
			}

			#tabs div.active:after{
				width: 1.5rem;
				border-radius: 8px;
			}

			#tabs div:after{
				content: "";
				position: absolute;
				display: block;
				width: 0;
				height: .5rem;
				background-color: #282828;
				bottom: 0;
				left: 50%;
				transition: all .4s;
				transform: translate(-50%,0);
				-webkit-transform: translate(-50%,0);
			}

			.tab {
				align: center;
				height: 3.5rem;
				line-height: 3rem;
				font-weight: 500;
				color: #282828;
			}

			.command {
				font-size: 1.4rem;
				font-weight: bold;
				color: #333333;
				margin-left: 1.5rem;
				margin-right: 2rem;
				box-sizing: border-box;
				position: relative;
			}

			.aui-ellipsis-3 {
				display: -webkit-box;
				overflow: hidden;
				text-overflow: ellipsis;
				word-wrap: break-word;
				word-break: break-all;
				white-space: normal !important;
				-webkit-line-clamp: 3;
				-webkit-box-orient: vertical;
			}

			.command:after {
				content: "";
				position: absolute;
				display: block;
				width: 0;
				height: .25rem;
				background-color: #282828;
				bottom: 0;
				left: 50%;
				transition: all .4s;
				transform: translate(-50%, 0);
				-webkit-transform: translate(-50%, 0);
			}

			.command.active:after {
				width: 2.6rem;
			}

			.follow-mask {
				position: fixed;
				top: 0;
				bottom: 0;
				left: 0;
				right: 0;
				background: rgba(38,38,38,0.66);
				z-index: 100;
			}

			.activity-alertView .activity_bookView{
				position: fixed;
				padding-top: 2rem;
				padding-left: 2rem;
				background-color: white;
				border-radius: 0.78rem;
				top: 5.2rem;
				height: auto;
				left: 3.12rem;
				right: 3.12rem;
				z-index: 120;
			}

			.newUser_activity .newUser_activity_bookView {
				position: fixed;
				padding-top: 2rem;
				background-color: white;
				border-radius: 0.78rem;
				top: 10rem;
				height: 38rem;
				left: 4rem;
				right: 4rem;
				z-index: 120;
				overflow: hidden;
			}

			.activity-list ul {
				overflow: hidden;
			}

			.activity-list ul li {
				float: left;
				height: 14rem;
				width: 7.9rem;
				margin: 1.82rem 1.3rem 0 .52rem;
				position: relative;
			}

			#warn{
				background: rgba(0, 0, 0, 0.7);
				text-align: center;
				border-radius: 0.26rem;
				color: white;
				position: fixed;
				z-index: 3000;
				top: 45%;
				left: 25%;
				width: 50%;
				height: 4.16rem;
				line-height: 0.1rem;
				display: none;
				padding-top: 2.08rem;
			}

			.top-tag-container {
				padding: 16rem 1.2rem 1.56rem 1.2rem;
			}

			.top-tag-container ul {
				overflow: hidden;
			}

			.top-tag-container ul li {
				float: left;
				height: 3.6rem;
				width: 6.5rem;
				margin: 1.1rem 1.1rem 0 1.1rem;
				position: relative;
			}
			#presenter_box{
				margin-top: 21rem;
				position: relative;
			}


			.recommend_btn{
				height: 4rem;
				text-align: center;
				margin-bottom: .8rem;
				margin-top:2rem;
			}

			.presenter{
				margin: 0 auto;
				width: 13rem;
				height: 16rem;
				position: relative;
			}
			.presenter_img{
				width: 13rem;
				height: 16.9rem;
				margin: .8rem auto 0rem;
				border-radius: 4px;
				box-shadow: 0 0 8px 0.52rem #eff0f5;

			}
			.presenter_icon{
				width: 4.5rem;
				height: 4.4rem;
				position: absolute;
				right: -1.5rem;
				top: -1.5rem;
			}
			.recommend_btn p{
				display: inline-block;
				height: 3.5rem;
				padding: 0  1.2rem !important;
				border-radius: 10rem;
				line-height: 3.5rem;
				font-size: 1.5rem;
				font-weight: 500;

				margin: 1rem 0;
			}
			.bookrecommend{
				height: 5rem;
				font-size: 1.5rem;
				margin-top: 2rem;
				margin-bottom: 1rem;
			}
			.recommend_btn p:nth-child(1){
				background: #ffda43;
				margin-right: 1.05rem;
				color: #000;
				height: 3.5rem;
			}
			.recommend_btn p:nth-child(2){
				border: 1px solid #FF9D3C;
				color: #FF9D3C;
				margin-left: 1.05rem;
				height: calc(3.5rem - 2px) ;
				line-height:calc(3.5rem - 2px)  ;
			}
			.swiper-pagination-bullets{
				left: 120px !important;
			}
			.swiper-pagination-bullet-active{
				background: #FFDA43 !important;
			}
			.swiper-pagination-bullet{
				width: 5px !important;
				height: 5px !important;
			}
			.all_btn{
				position: absolute;
				bottom: 0;
				right: 0;
				height: 3rem;
				padding: 0 1.5rem;
				border-radius: 10rem;
				background: #ffda43;
				line-height: 3rem;
				font-weight: bold;
				color: #444444;
				/*box-shadow: 0 2px 5px 0 #F8CAA7;*/
			}
            .hot p{
                width: 13rem;
            }
            .hot{
                width: auto!important;
                margin-right: 2rem!important;
            }
		</style>
		<style type="text/css">
			.search-container {
				position: fixed;
				background: #FFFFFF;
				top: 5rem;
				left: 0;
				width: 100%;
				z-index: 10;
				height: 4.4rem;
			}

			.search-view {
				position: absolute;
				height: 3.5rem;
				width: 92%;
				top: 1rem;
				left: 4%;
				border-radius: 0.6rem;
				background: #eee;
			}

			.search-container .search-input {
				height: 3.5rem;
				line-height: 3.5rem;
				padding-left: 3.5rem;
				font-size: 1.4rem;
				color: #999;
			}

			.search-container .search-icon {
				background: url(../img/ic_search.png) no-repeat center center;
				background-size: 100% 100%;
				width: 2.2rem;
				height: 2.2rem;
				top: .7rem;
				position: absolute;
				left: 1rem;
				overflow: hidden;
			}
			#merchant{
				height: 6rem;
				position: fixed;
				top: 0;
				width: 100%;
				background: #fff;
				z-index: 10;
			}
			.index_r{
				float: right;
				padding: 0 1.5rem;
				height: 2.8rem;
				background: #ffda43;
				line-height: 2.8rem;
				text-align: center;
				border-radius: 1.4rem;
				font-size: 1.4rem;
				color: #101010;
				margin-right: 1.5rem;
				margin-top: 1.5rem;
			}
			.index_l{
				float: left;
			}
			.index_l img{
				height: 3.8rem;
				width: 3.8rem;
				border-radius: 50%;
				float: left;
				margin-left: 1.5rem;
				margin-top: 1rem;
				margin-right: 1rem;
			}
			.index_l>div{
				float: left;
			}
			.index_l>div p:nth-child(1){
				font-size: 1.4rem;
				color: #000;
				margin-top: .8rem;
				margin-bottom: 0!important;
			}
			.index_l>div p:nth-child(2){
				color: red;
				font-size: 1.2rem;
			}
			#tabs{
				height: 5rem;align-items: center;
				justify-content: space-around;
				font-size: 1.8rem;
				display: flex;
				background: #FFFFFF;
				position: fixed;
				top:9.5rem;
				width: 100%;
				color: #999;
				z-index: 99;
				box-shadow: 0 0.3rem 0.2rem 0.4rem #F6F6F6;
			}
			.codebag{
				position: fixed;
				z-index: 100;
				background: rgba(0,0,0,.5);
				height: 100%;
				width: 100%;
				display: none;
			}
			.code_box{
				height: 40rem;
				width: 25rem;
				z-index: 101;
				position: fixed;
				top: 50%;
				margin-top: -20rem;
				left: 50%;
				margin-left: -12.5rem;
				display: none;
				background: url(img/codeBag.png) no-repeat;
				background-size: contain;

			}
			.codeImg{
				width: 17rem;
				height: 17rem;
				position: absolute;
				top: 16.5rem;
				left: 4rem;
			}
			.code_box h1{
				font-size: 1.6rem;
				color: black;
				margin-bottom: 1.5rem;
				font-weight: bold;
				text-align: center;
				width: 100%;
				margin-top: 7rem;
			}
			.code_box p{
				font-size: 1.4rem;
				color: #686868;
				text-align: center;
				width: 100%;
			}
			.smallCourse{
				min-height: 10.4rem;
				height:auto;
				width:100%;
				padding:0.572rem 1.456rem 0.572rem 1.456rem;
				margin-bottom: 1rem;
				background: #fff;
			}
			.vip_img_bg{
				margin-top: 44rem;
				background: #f5f5f5;
				padding: 1rem 0;
			}
			.vip_img{
				padding: 1.5rem;
				overflow: hidden;
				background: #fff;
			}
			.vip_bg{
				background: url(img/bg_bg_vip.png) no-repeat;
				height: 4rem;
				overflow: hidden;
				position: relative;
				top: 16rem;
				width: 100%;
				background-size: 100% 100%;
			}
			.vip_bg p{
				padding: 0 1rem;
				height: 2.1rem;
				margin-top: .92rem;
				line-height:2rem;
				border-radius: 24px;
				color: #e9d9b1;
				border: 1px solid #e9d9b1;
				float: right;
				margin-right: 1.5rem;
			}
		</style>
	</head>

	<body style="display: none;">
	<div class="codebag"></div>
	<div class="code_box">
		<h1>关注我们</h1>
		<p>第一时间为你推送每日上新听书。</p>
		<img class="codeImg" src="" alt="">
	</div>

		<div id="main" class="flex-con" style="padding-bottom: 4.16rem;overflow: hidden;">
			<div id="merchant">
				<div class="index_l">
					<img src="img/midu-logo.jpg" alt="">
					<div>
						<p class="user_img"></p>
						<p class="user_img_1"></p>
					</div>
				</div>
				<div class="index_r">
					<a href=""></a>
				</div>
			</div>
			<div class="search-container">
				<div class="search-view">
					<span class="search-icon"></span>
				<p class="search-input">搜作者或书名</p>
				</div>
			</div>

			<div id="tabs">
				<div id="tab_0" class="active" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem; color: #333;font-weight: bold;">推荐</div>
				<div id="tab_1" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">职场</div>
				<div id="tab_2" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">心理</div>
				<div id="tab_3"  style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">生活</div>
				<div id="tab_4" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">小说</div>
				<div id="tab_5" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">文化</div>
	 	</div>
		<div class="vip_bg">
			<p>立即开通</p>
		</div>
	 	<div class="recommend">
			<!--好友助力-->
			<div class="col-xs-12" id="presenter_box"></div>
			<!--轮播图-->
	 		<div class="swiper-container" id="slideBox"></div>
	 		<div></div>
				<!--优惠券-->
					<div id="coupon_html">
					</div>
					<!--蜜读小课-->
					<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
						<div align="center" class="col-xs-12"style="margin-bottom: 2.5rem;">
							<p style="left:0;right:0;margin:3rem 0 2rem 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">蜜读小课</p>
							<p class="lookAll_smallCourse" align="right" style="font-size: 1.2rem;color: #999999; margin: -4.2rem 1rem 0 0;">查看全部</p>
							<img align="right" src="../icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
						</div>
					</div>
					<div id="smallCourse_html">
					</div>
			<div class="vip_img_bg">
				<div class="vip_img" >
					<img src="img/bg_index_vip.png" alt="">
				</div>
			</div>

					<!--精品课-->
					<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
						<div align="center" class="col-xs-12" style="margin-bottom: 1.5rem;">
							<p style="left:0;right:0;margin:3rem 0 0 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">精品课</p>
							<p align="right" class="lookAll_course" style="font-size: 1.2rem;color: #999999; margin: -2.2rem 1rem 0 0;">查看全部</p>
							<img align="right" src="icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
						</div>
					</div>
					<div class="swiper-container1" id="course_html">
			       </div>
					<!--必听书单-->
					<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
						<div align="center" class="col-xs-12"style="margin-bottom: 2.5rem;">
							<p style="left:0;right:0;margin:3rem 0 2rem 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">必听书单</p>
							<p class="lookAll_list" align="right" style="font-size: 1.2rem;color: #999999; margin: -4.2rem 1rem 0 0;">查看全部</p>
							<img align="right" src="icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
						</div>
					</div>
					<div id="list_html">
					</div>
					<!--热听好书-->
					<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
						<div align="center" class="col-xs-12" style="margin-bottom: 1rem;">
							<p style="left:0;right:0;margin:3rem 0 0 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">热听好书</p>
							<p align="right" class="lookAll_hot" style="font-size: 1.2rem;color: #999999; margin: -2.2rem 1rem 0 0;">查看全部</p>
							<img align="right" src="icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
						</div>
					</div>
					<div class="swiper-container2" id="hot_html">
			     </div>
					<!--全部听书-->
					<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
						<div align="center" class="col-xs-12"style="margin-bottom: 3rem;">
							<p style="left:0;right:0;margin:3rem 0 0 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">全部听书</p>
						</div>
					</div>
					<div id="book_html"></div>
		</div>

		<div class="category hide">
				<div class="top-tag-container"><ul id="TopCategory"></ul></div>
		        <script type="text/html" id="TopCategory_Item">
			   {{each cateArr}}
			<li>
				<p class="category_btn" id={{"cate_" + $index}} style=" border-radius: 1.8rem; width: 6.5rem;height: 3.6rem; color: #333;text-align: center;font-size: 1.3rem;line-height: 3.6rem;">{{$value.name}}</p>
			</li>
			{{/each}}
		</script>
					<div id="book_html1"></div>
			</div>
	 	</div>

		<div id="footer" class="border-t" style="position: fixed;bottom: 0;left: 0;z-index: 99;width: 100%;height: 4.9rem;">
			<ul class="flex-wrap" style="height: 4.9rem;">
				<li tapmode="hover" class="flex-con active" style="height: 4.9rem;background-size: 2rem 2rem;line-height: 7.8rem; font-size: 1.3rem;">首页</li>
				<li id="mine" tapmode="hover" class="flex-con" style="height: 4.9rem;background-size: 2rem 2rem;line-height: 7.8rem; font-size: 1.3rem;">书架</li>
				<li id="center" tapmode="hover" class="flex-con" style="height: 4.9rem;background-size: 2rem 2rem;line-height: 7.8rem; font-size: 1.3rem;">我的</li>
			</ul>
		</div>
		<script type="text/html" id="banner_template">
			<div class="swiper-wrapper">
				{{each data.bannerList}}
				<div class="swiper-slide bannerlist" data-bannertype="{{$value.bannertype}}"  data-bookid="{{$value.id}}">
					<img src="{{$value.img | addUrl}}" style="width: 100%;height: 12rem;" />
				</div>
				{{/each}}
			</div>
			<div class="swiper-pagination"></div>
		</script>

		<!--好友助力-->
	<script type="text/html" id="presenter_template">
			{{each presenter}}
			<div class="presenter" data-bookid="{{$value.bookid}}" data-isorder="{{$value.isorder}}">
				<img class="presenter_icon" src="img/jinri_icon.png" alt="">
				<img class="presenter_img" src="{{ $value.bookimg | addUrl}}" alt="">
			</div>
			<div class="recommend_btn">
				{{if userVip.type==1|| $value.isorder==1}}
				<p class="voiceBook_btn" data-bookid="{{$value.bookid}}" data-bookname="{{$value.bookname}}" data-bookimg="{{$value.bookimg}}">开始听书</p>
				{{else}}
				<p class="payment_click" data-bookid="{{$value.bookid}}" data-bookname="{{$value.bookname}}" data-bookimg="{{$value.bookimg}}">购买￥{{$value.bookprice}}</p>
				{{/if}}
			</div>

			<div class="bookrecommend">
				推荐语：{{$value.bookrecommend}}
			</div>
			{{/each}}
			</div>
		</script>
		<script id="smallCourse_template" type="text/html">
			{{each listArr}}
			<div class="col-xs-12 smallCourse" style="" data-bookid={{$value.bookid}} >
				<div class="col-xs-4" style="height:10rem;width: 29.999%;padding:0rem;">
					<a href="javascript:;" style="text-decoration: none;">
						<img src="{{$value.bookimg | addUrl}}" style="width:10rem;height:100%;border-radius: 5%/5%">
					</a>
				</div>
				<div class="col-xs-8" style="position: relative;height:10rem;width:68.666666%;top:0rem;left:0.52rem;padding: 0.2rem 0.572rem 0.5rem 0rem;">
					<span class="aui-ellipsis-2 " style="position: relative;left:0rem;margin: 0;font-size: 1.66rem;line-height:2rem;font-weight: bold;overflow: hidden;white-space: nowrap;text-overflow:ellipsis;">{{$value.bookname}}</span>
					<p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;margin-top: 0.6rem;">{{$value.bookrecommend}}</p>
					<div style="position:absolute;bottom: 0;">
						{{if $value.isorder == 1 || userVip.type == 1}}
						<p style="float:left;color: #feb255;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;">已购买</p>
						{{else}}
						<p style="float:left;color: #999;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;">{{$value.bookprice}}元/共{{$value.chaptercount}}节</p>
						{{/if}}
					</div>
				</div>
			</div>
			{{/each}}
		</script>

		<!--必听书单-->
		<script id="list_template" type="text/html">
			{{each listArr}}
			{{if $index > 0}}
			<div onclick="goTOListDetail({{$value.themeid}})" class="col-xs-12" style="min-height: 10.4rem;height:auto;width:100%;padding:0.572rem 1.456rem 0.572rem 1.456rem;margin-bottom: 1rem;">
				<div class="col-xs-4" style="height:10rem;width: 29.999%;padding:0rem;">
					<a href="javascript:;" style="text-decoration: none;">
						<img src="{{$value.img | addUrl}}" style="width:10rem;height:100%;border-radius: 5%/5%">
					</a>
				</div>
				<div class="col-xs-8" style="position: relative;height:10rem;width:68.666666%;top:0rem;left:0.52rem;padding: 0.2rem 0.572rem 0.5rem 0rem;">
					<span class="aui-ellipsis-2 " style="position: relative;left:0rem;margin: 0;font-size: 1.66rem;line-height:2rem;font-weight: bold;overflow: hidden;white-space: nowrap;text-overflow:ellipsis ;">{{$value.title}}</span>
					<p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;margin-top: 0.6rem;">{{$value.contentabstract}}</p>
					<div style="position:absolute;bottom: 0;">
						<span style="float:left;color: #999;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;border-right:1px solid #999;padding-right: .088rem;">{{$value.bookCount}}本书</span>
						<span style="float:left;color: #999;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;padding-left: .46rem;">{{$value.clickCount | totalReadCount}}人在听</span>
					</div>
				</div>
			</div>
			{{/if}}
			{{/each}}
		</script>

		<!--精品课-->
		<script type="text/html" id="course_template">
			<div class="swiper-wrapper">
				{{each courseArr}}
				<div class="swiper-slide" onclick="goTOThemeDetail({{$value.themeid}})">
					<div class="course_bigView" style="margin: 1.5rem 0 1.5rem 1.5rem; width: 27.2rem; height: 19.5rem;background-color: white;box-shadow: 0 0 0.52rem 0.52rem #eff0f5;border-radius: 0.5rem;">
						<img src="{{$value.bigimg | addUrl}}" style="width: 100%;height: 12rem;" />
						<p style="padding-left: 1.0rem;margin-top: 1.5rem;margin-bottom: 0; color: #333333;font-size: 1.66rem;font-weight: bold; overflow: hidden;white-space: nowrap;text-overflow:ellipsis ;">{{$value.title}}</p>
						<p style="padding-left: 1.0rem;margin-top: .6rem;margin-bottom: 0;color: #999999;font-size: 1.2rem;">{{$value.bookCount + "节课 | " + $value.clickCount + "人在学"}} </p>
						{{if userVip.type==1}}
						<p align="right" style="padding-right: 1.0rem;margin-top: -1.8rem;color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.price}}</s><span style="color: #FF9D3C;font-size: 1.4rem;font-weight: bold;"> VIP ¥0</span></p>
					    {{else if $value.isorder==1}}
					    <p align="right" style="padding-right: 1.0rem;margin-top: -1.8rem;color: #FF9D3C;font-size: 1.4rem;">已购买</p>
					    {{else}}
					    <p align="right" style="padding-right: 1.0rem;margin-top: -1.8rem;color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.originalPrice}}</s><span style="color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">{{" ¥ " + $value.price}}</span></p>
					    {{/if}}
					</div>
				</div>
				{{/each}}
			</div>
			<div class="swiper-pagination"></div>
		</script>

		<!--热听好书-->
		<script type="text/html" id="hot_template">
			<div class="swiper-wrapper" style="padding-left: 1.5rem; ">
				{{each hotArr}}
				<div class="swiper-slide hot" data-bookid={{$value.bookid}} data-videoauthorid={{$value.videoauthorid}} data-copywriter={{$value.copywriter}} data-bookname={{$value.bookname}} data-bookimg={{$value.bookimg}} data-bookrecommend={{$value.bookrecommend}}>
					<img src="{{$value.bookimg | addUrl}}" style="margin: 2.5rem 0 0 0rem; width: 13rem; border-radius: 4px; box-shadow: 3px 3px 3px #e6e6e6;" />
					<p style="margin-top: 1.7rem; margin-bottom: 0; color: #333333;font-size: 1.66rem; font-weight: bold;overflow: hidden;white-space: nowrap;text-overflow:ellipsis ;">{{$value.bookname}}</p>
					<p style="margin-top: .3rem;  margin-bottom: 0; color: #999999;font-size: 1.2rem;">{{$value.videoduration}} </p>
					{{if userVip.type==1}}
					    <p style="margin-top: 0.6rem;color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">VIP ¥0 <span style="color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.bookprice}}</s></span></p>
					{{else if $value.isorder==1}}
					    <p style="margin-top: 0.6rem;color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">已购买</p>
					{{else}}
					    <p style="color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">{{"¥ " + $value.bookprice}}</p>
					{{/if}}
				</div>
				{{/each}}
			</div>
		</script>

		<!--全部听书-->
		<script id="book_template" type="text/html">
			{{each bookArr}}
			<div class="col-xs-12 bookdetail" style="min-height:12rem;height:auto;width:100%;padding-left: 1.456rem;padding-right: 1.456rem;" data-bookid={{$value.bookid}} data-isorder="{{$value.isorder}}">
				<div class="col-xs-4" style="height:12rem;width: 29.3333%;padding:0rem;">
					<a href="javascript:;" style="text-decoration: none;">
						<img src="{{$value.bookimg | addUrl}}" style="width: 9.17rem;height: 12rem;box-shadow: 3px 3px 3px #e6e6e6; border-radius: 4px">
						<img src="icon/listen.png" style="width: 1.66rem; height: 1.66rem; margin-top: -1.82rem; margin-left: 7.28rem;"/>
					</a>
				</div>
				<div class="col-xs-8" style="position: relative;height:12rem;width:68.666666%;top:0rem;left:0.52rem;padding: 0.2rem 0.572rem 0.5rem 0rem;">
					<span class="aui-ellipsis-2 " style="position: relative;left:0rem;margin: 0;font-size: 1.66rem;line-height:2rem;font-weight: bold;">{{$value.bookname}}</span>
					<p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;margin-top: 0.78rem;margin-bottom: 0;">{{$value.bookrecommend}}</p>
					{{if progessArr}}
					{{if progessArr[$index] == 0}}
					<div style="position:absolute;bottom: 0.1rem;">
						<span style="float:left; height: 3rem;line-height: 3rem ;color: #999;font-size: 1.2rem;margin-top: .5rem;padding-right: .46rem;">{{$value.videoduration}}</span>
					</div>
					{{else}}
					<div style="position:absolute;bottom: 0.1rem;">
						<span style="float:left;color: #999;font-size: 1.2rem;line-height: 1.3rem;margin-top: .5rem;padding-right: .46rem;">{{$value.videoduration + " " + progessArr[$index]}}</span>
					</div>
					{{/if}}
					{{else}}
					<div style="position:absolute;bottom: 0.1rem;">
						<span style="float:left;color: #999;font-size: 1.2rem;line-height: 1.3rem;margin-top: .5rem;padding-right: .46rem;">{{$value.videoduration}}</span>
					</div>
					{{/if}}
					{{if (userVip.type==1||$value.isorder==1)}}
					<div class="begin-read" data-isactivity={{$value.book_activity}} data-isorder={{$value.isorder}} data-bookid={{$value.bookid}} style="position: absolute;right: 1.4rem;bottom: 0;width: 7.8rem;height:3rem;background:#fbd454;border-radius: 10rem;text-align: center;color: #333333;font-size: 1.4rem; padding-top: 0.3rem;line-height: 2.95rem;font-weight: bold;">
						开始听书
					</div>
					{{else}}
					<div style="position: absolute;right: 1.5rem;height: 3rem;line-height: 3rem ;bottom: 0.2rem;font-size: 1.4rem; font-weight: bold; text-align: center;color: #FF9D3C;">
						{{"¥ " + $value.bookprice}}
					</div>
					{{/if}}
				</div>
			</div>
			<div class="col-xs-12" style="height: 2rem;width: 100%;"></div>
			{{if $index == (bookArr.length - 1)}}
			<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
				<div align="center" class="col-xs-12" style="margin-bottom: 1rem;">
					{{if isFinish == 0}}
					<p class="click_lookMore" style="margin:1.5rem 32%; height: 3.5rem; font-weight: bold; font-size: 1.3rem;color: #333333; background: #EEEEEE; padding-top: 0.8rem; border-radius: 1.75rem;">加载更多听书</p>
					{{else}}
					<p style="margin:1.5rem 0; font-size: 1.3rem;color: #CCCCCC;">已显示全部听书</p>
					{{/if}}
				</div>
			</div>
			{{/if}}
			{{/each}}
		</script>
		<!--赠一得一弹窗-->
		<div class="activity-alertView hide">
			<div class="follow-mask"></div>
			<div class="activity_bookView hide" align="center">
				<div class="activity-list" align="center">
				    <p style="font-size: 1.66rem; width: 100%; left: 0; text-align: center; font-weight: bold; color: #333333;">分享免费领</p>
				    <p class="stageNum" style="font-size: 1.3rem; width: 100%; left: 0; text-align: center; color: #666666;margin-top: 0.5rem;"></p>
				    <ul id="activity_book" style="margin-top: 1.2rem;"></ul>
				    <div class="free_receive_btn" style="background-color: #FF9D3C; left: 0; margin-top: 3rem; margin-bottom: 1.82rem; margin-right: 2rem; height: 4rem; color: white; font-size: 1.4rem; text-align: center; border-radius: 0.3rem; padding-top: 1rem; ">免费领取</div>
			    </div>
			    <script type="text/html" id="activity_Item">
				     {{each data.book_list}}
				      <li>
				          <div class="activity_Item_div">
					      <img class="activity_bookimg" src="{{$value.bookimg | addUrl}}" style="width: 8.3rem; height: 10.3rem; box-shadow: 3px 3px 3px #e6e6e6;border: 0;vertical-align: middle;"/>
					      <img src="icon/listen.png" style="width: 1.66rem; height: 1.66rem; margin-left: 5.2rem; margin-top: -2.08rem;"/>
					      <p style="font-size: 1.3rem;overflow: hidden;white-space: nowrap; text-overflow: ellipsis; width: 9.17rem; color: #333333; margin-top: 1.3rem;">{{$value.bookname}}</p>
		                  </div>
				      </li>
				    {{/each}}
			    </script>
			</div>
			<img class="closeBtn" src="img/close_img.png" style="position: absolute; width: 4rem; height: 4rem; top: 3rem;right: 1rem;z-index: 125;"/>
		</div>
		<!--广告弹窗-->
		<img id="activity_Advertisement_id" class="activity_Advertisement hide" src="" style="z-index: 120; position: fixed; left: 0; width: 100%; top: 0;height: 100%;"/>
		<!--新手礼包弹窗-->
		<img class="activity_newUserImgView hide" src="img/newUserImage.png" style="z-index: 120; position: fixed; left: 0; width: 100%; top: 0;height: 100%;"/>
		<div class="newUser_activity hide">
			<div class="follow-mask"></div>
			<div class="newUser_activity_bookView" align="center">
				<p align="center" style="font-size: 2.0rem; color: #333333; font-weight: bold;margin-top: 0rem;">新用户专享</p>
				<p align="center" style="font-size: 1.3rem; color: #666666;margin-top: -1.0rem;margin-bottom: 2.5rem;">连续七天，每天送你一本好书</p>
				<div class="swiper-container3" id="new_html"></div>
			</div>
			<img class="closeBtn" src="img/close_img.png" style="position: absolute; width: 4rem; height: 4rem; top: 8rem;right: 2rem;z-index: 125;"/>
			<script type="text/html" id="newUser_template">
			<div class="swiper-wrapper">
				{{each data}}
				<div class="swiper-slide" style="left: 0; width: 100%; height: 25.5rem;">
					<img src="{{$value.bookimg | addUrl}}" style="width: 10rem;height: 13.2rem;" />
						<p align="center" style="font-size: 1.5rem; color: #333333; margin-top: 0.5rem;">{{$value.bookname}}</p>
						{{if $value.isorder == 1 || userVip.type == 2}}
						<div class="newUser_receiveBtn" style="left: 15%; width: 70%; height: 4.5rem; background-color: #f8d44c; color: #333333; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">开始听书</div>
						{{else if $index == localDay - 1}}
						<div class="newUser_receiveBtn" style="left: 15%; width: 70%; height: 4.5rem; background-color: #f8d44c; color: #333333; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">今日免费</div>
						{{else if $index < localDay - 1}}
						<div style="left: 15%; width: 70%; height: 4.5rem; background-color: #EEEEEE; color: #999999; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">未领取</div>
						{{else}}
						<div style="left: 15%; width: 70%; height: 4.5rem; background-color: #EEEEEE; color: #999999; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">待领取</div>
						{{/if}}
				</div>
				{{/each}}
			</div>
			<div class="swiper-pagination" style="padding-bottom: 9rem;"></div>
			<p align="center" style="font-size: 1.2rem; color: #999999;">领取成功后在「书架」查看</p>
		</script>
		</div>
		<!--若提示框-->
		<div id="warn"></div>
		<img class="showNewUser hide" src="img/newUser_icon.png" style="width: 7.5rem; height: 7.5rem; bottom: 8.2rem; right: 0; position: fixed; z-index: 80;"/>
	</body>
</html>

<script src="js/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/purl.js"></script>
<script src="js/swiper-3.4.2.jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/aui-dialog.js" type="text/javascript" charset="utf-8"></script>
<script src="js/aui-toast.js" type="text/javascript" charset="utf-8"></script>
<script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">



	var toast = new auiToast();
	var todayArr1 = new Array();//每日听书——主编推荐
	var courseArr = new Array();//精品课
	var listArr = new Array();//必听书单
	var hotArr = new Array();//热听好书
	var bookArr = new Array();//全部听书
	var smallCourseArr = new Array();//蜜读小课
	var page = 1;
	var mySwiper;
	var newUserArr = new Array();//新手礼包
	var advertisement_dict;//广告位
	var userInfo;
	var cateBookArr = new Array();
	var cateArr = new Array();
    var isSubscribe //查询用户是否订阅公众号
    var isFollow = false;//查询用户是否关之公众号
	var followUrl;

	template.defaults.imports.addFaceUrl = function(value) {
		if(value == "" || value == null) {
			return "img/book.png"
		} else {
			if(checkURL(value)) {
				return value;
			} else {
				return imgFaceurl + value
			}
		}
	};


	function goTOListDetail(id) {
		window.location.href = "listDetail.html?themeId=" + id;
	}

	function goTOThemeDetail(id) {
		window.location.href = "themeDetail.html?themeId=" + id;
	}

	$(function() {

		$('.lookAll_course').click(function(){
			window.location.href = "courseList.html";
		})

		$('.lookAll_list').click(function(){
			window.location.href = "allTheme.html";
		})

		$('.lookAll_smallCourse').click(function(){
			window.location.href = "allTheme.html?type=1";
		})

		$('.lookAll_hot').click(function(){
			window.location.href = "hotBookList.html";
		})

		$('#book_html').on('click', '.click_lookMore', function(e) {
			e.stopPropagation();
			e.cancelBubble = true;
			page ++;
			getBookListDown();
		})

		var tabSwiper = new Swiper('.tab-container', {
			direction: 'horizontal',
			onSlideChangeEnd: function(swiper) {
				var dom = $(".command");
				for(var i = 0; i < dom.length; i++) {
					$(dom).removeClass("active");
				}
				$(dom).eq(swiper.activeIndex).addClass("active");
			},

		})

		$('body').show();

		if (localStorage.getItem("refresh")) {
			localStorage.removeItem("refresh");
		}else {
			toast.loading({
				title: "加载中",
				duration: 2000
		    });
		}



		$('.swiper-container3').on('click', function(e) {
			var dict = newUserArr[mySwiper.activeIndex];
			if (dict.isorder == 1 || userVip.type == 2) {//开始听书
				//恢复滑动效果
				document.body.style.overflow = 'auto';
				window.removeEventListener('touchmove', _preventDefault);
				$('.newUser_activity').addClass('hide');
				location.href = "chapter.html?bookid=" + dict.bookid +  "&bookname="+ dict.bookname +"&bookimg=" + dict.bookimg;
			}else if (mySwiper.activeIndex + 1 == localStorage.getItem("localDay")) {//今日免费
				$.ajax({
					type:"get",
					url:hostUrl + "order/freetime?channel=weixin&type=1&userid=" + openId + "&themeid=" + dict.bookid,
					async:true,
					success:function(data) {
						//恢复滑动效果
						document.body.style.overflow = 'auto';
						window.removeEventListener('touchmove', _preventDefault);
						$('.newUser_activity').addClass('hide');
						location.href = "mine.html";
					}
				});
			}
		})



		function setCookie(name, value) {
			var argv = setCookie.arguments;
            var argc = setCookie.arguments.length;
            var expires = (argc > 2) ? argv[2] : null;
            if (expires!=null) {
            	   var LargeExpDate = new Date ();
               LargeExpDate.setTime(LargeExpDate.getTime() + (expires*1000*3600*24));
            }
            document.cookie = name + "=" + escape (value)+((expires == null) ? "" : ("; expires=" +LargeExpDate.toGMTString()));
		}

		function getCookie(Name) {
			var search = Name + "=";
			if (document.cookie.length > 0) {
				 offset = document.cookie.indexOf(search);
				 if (offset != -1) {
				 	offset += search.length
                    end = document.cookie.indexOf(";", offset)
                    if(end == -1) end = document.cookie.length
                    return unescape(document.cookie.substring(offset, end))
				 }else {
				 	return "";
				 }
			}
		}


		function home() {
            var merchant = JSON.parse(sessionStorage.getItem('weixinData')).data  //获取商户信息
            if(merchant.model == undefined){
                $('.index_l img').attr('src',merchant.headImgUrl)//商户头像
                $('.user_img').text(merchant.nickname)//商户名称
            }else {
                $('.index_l img').attr('src',merchant.model.headImgUrl)//商户头像
                $('.user_img').text(merchant.model.nickname)//商户名称
            }


            //获取商户信息
            var signs = hex_md5(objKeySort({token: token, timestamp: date}))

            $.ajax({
                type:"get",
                url:hostUrl + 'merchant/update/info/get',
                data:{
                    token: token,
                    timestamp: date,
                    sign:signs,
                },
                async:true,
                success:function(data) {
                    localStorage.setItem('heaimg',data.data.headImgUrl)
                    localStorage.setItem('recommend',data.data.signature)
                }
            });




			getBookListDown();
            var sign = hex_md5(objKeySort({token:token,timestamp:date,merchantId:merchantId}))//商品列表签名
            $.ajax({
				type: "get",
				url: hostUrl + 'home/index/'+ token +'/'+ sign +'/' + date + '/' + merchantId,
				async: true,
				success: function(data) {
                    todayArr1 = data.data.bookList;
                    hotArr = data.data.bookList2;
                    courseArr = data.data.themeList2;
                    listArr = data.data.themeList;
                    smallCourseArr = data.data.bookList3;

					data.userVip=userVip;
                    shareWx("欢迎来到我的听书小馆~", localStorage.getItem('heaimg'), '有声书、小课、精品课，超2000集音频节目，涵盖26大领域，海量知识内容任你选！');
//					轮播图
					var banner_html = template("banner_template", data);
					document.getElementById('slideBox').innerHTML = banner_html;
					var mySwiper = new Swiper('.swiper-container', {
						direction: 'horizontal',
						loop: true,
						autoplay: "3000",
						slidesPerView: 1,
						// 如果需要分页器
						pagination: '.swiper-pagination',
					})
//					每日听书
//					主编推荐
//					音频进度
					if (window.localStorage) {
					var progess;
					var bookid;
					var bookCount;
					var progessStr;
					var progessArr = new Array();
					for (var i = 0; i < todayArr1.length; i ++) {
						bookid = todayArr1[i]["bookid"];
						bookCount = localStorage.getItem(bookid + "_count");
						bookCount = parseInt(bookCount);
						progess = 0;
						if (bookCount) {
							for (var j = 0; j < bookCount; j ++) {
								var value = localStorage.getItem(bookid + "_" + j);
								if (value) {
									var timeArr = value.split("_");
									if (timeArr.length == 2) {
										currentTime = parseInt(timeArr[0]);
			                            duration = parseInt(timeArr[1]);
			                            progess += parseInt((currentTime * 100) / duration);
									}
								}
								if (j == bookCount - 1) {
									if (progess == 0 || !progess) {
			                        	   progessStr = "0";
			                        	}else {
			                        		if (parseInt(progess / bookCount) >= 100) {
			                        			progessStr = "已听完";
			                        		} else{
			                        			progessStr = "已听" + parseInt(progess / bookCount) + "%";
			                        		}
			                        	}
			                    }
							}
						} else{
							progessStr = "0";
						}
						progessArr.push(progessStr);
					}
				}
				data.progessArr = progessArr;
					// 好友助力
                    data.presenter = todayArr1;
                    var pres = template("presenter_template",data);
                    document.getElementById('presenter_box').innerHTML = pres

				//					精品课
					data.courseArr = courseArr;
					var course_html = template("course_template", data);
					document.getElementById('course_html').innerHTML = course_html;
					var mySwiper = new Swiper('.swiper-container1', {
						direction: 'horizontal',
						loop: false,
						slidesPerView: 1.24,
					})

//					必听书单
					data.listArr = listArr;
					var list_html = template("list_template", data);
					document.getElementById('list_html').innerHTML = list_html;

//					蜜读小课
					data.listArr = smallCourseArr;
					var smallCourse_html = template("smallCourse_template", data);
					document.getElementById('smallCourse_html').innerHTML = smallCourse_html;

//					热听好书
					data.hotArr = hotArr;
					var hot_html = template("hot_template", data);
					document.getElementById('hot_html').innerHTML = hot_html;
					var mySwiper = new Swiper('.swiper-container2', {
						direction: 'horizontal',
						loop: false,
						slidesPerView: 'auto',
					})

					toast.hide();

                    subscribe()

                    var signi = hex_md5(objKeySort({token: token, timestamp: date}))//查询用户是否关注或订阅签名
                    $.ajax({
                        type:"get",
                        url:hostUrl+"merchant/follow/info",
                        data:{
                            timestamp:date,
                            token:token,
                            sign:signi,
                            authorizerAppid:localStorage.getItem('Cappid')=='undefined' ? appId : localStorage.getItem('Cappid')
                        },
                        async:true,
                        success:function(data) {
                            isFollow = data.data.isFollow
                            followUrl = data.data.url;
                        }
                    });

                }
			});
		}

		getToken(home);


    function getBookListDown(){//下拉刷新
        var sign = hex_md5(objKeySort({token:token,timestamp:date,type:0,page:page,rows:10,merchantId:merchantId}))
        $.ajax({
			type:"get",
			url:hostUrl + 'product/book/list/'+ token +'/'+ sign +'/'+ date + '/' + merchantId + '/0/1/'+ page +'/10',
			async:true,
			success:function(data){
				if (data.status != 0) {
					return;
				}
				if (data.data.book_list.length < 10) {
					data.isFinish = 1;
				}else {
					data.isFinish = 0;
				}
				data.userVip=userVip;
				for (var i = 0; i < data.data.book_list.length; i ++) {
					  bookArr.push(data.data.book_list[i]);
				}
				page = parseInt((bookArr.length + 9) / 10);
				if (window.localStorage) {
					var progess;
					var bookid;
					var bookCount;
					var progessStr;
					var progessArr = new Array();
					for (var i = 0; i < bookArr.length; i ++) {
						bookid = bookArr[i]["bookid"];
						bookCount = localStorage.getItem(bookid + "_count");
						bookCount = parseInt(bookCount);
						progess = 0;
						if (bookCount) {
							for (var j = 0; j < bookCount; j ++) {
								var value = localStorage.getItem(bookid + "_" + j);
								if (value) {
									var timeArr = value.split("_");
									if (timeArr.length == 2) {
										currentTime = parseInt(timeArr[0]);
			                            duration = parseInt(timeArr[1]);
			                            progess += parseInt((currentTime * 100) / duration);
									}
								}
								if (j == bookCount - 1) {
									if (progess == 0 || !progess) {
			                        	   progessStr = "0";
			                        	}else {
			                        		if (parseInt(progess / bookCount) >= 100) {
			                        			progessStr = "已听完";
			                        		} else{
			                        			progessStr = "已听" + parseInt(progess / bookCount) + "%";
			                        		}
			                        	}
			                    }
							}
						} else{
							progessStr = "0";
						}
						progessArr.push(progessStr);
					}
				}
				data.progessArr = progessArr;
				data.bookArr = bookArr;
				var book_html = template("book_template", data);
			    document.getElementById('book_html').innerHTML = book_html;
			}
		});
    }


		$('.search-container').on('click', function() {
			location.href = "searchPage.html"
		})

		$("#main").on('click', '.bookdetail', function() {
			window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid')
		})

		$("#main").on('click', '.smallCourse', function() {
			window.location.href = "smallCourseDetail.html?bookid=" + $(this).attr('data-bookid')
		})

		$("#main").on('click', '.coupon', function() {
			$.ajax({
				type:"get",
				url:ascli(hostUrl+"order/receive/coupon?token=" +token),
				async:true,
				success: function(data){
					if (data.status == 0) {
						weekTip("领取成功");
					} else{
						weekTip("您的优惠券已领完");
					}
				}
			});
		})

		$("#main").on('click', '.bannerlist', function() {
			if($(this).attr('data-bannertype') == "6") { //主题
				window.location.href = "themeDetail.html?themeId=" + $(this).attr('data-bookid');
			} else if($(this).attr('data-bannertype') == "9") { //单本
				window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid')
			}else if($(this).attr('data-bannertype') == "7"){//会员
				window.location.href = "memberPage.html";
			}else if($(this).attr('data-bannertype') == "11"){//赠一得一活动
				window.location.href = "activity_freeReceive.html";
			}else if($(this).attr('data-bannertype') == "12"){//书单
				window.location.href = "listDetail.html?themeId=" + $(this).attr('data-bookid');
			}else {
				weekTip("功能开发中，敬请期待！");
				return;
			}
		})

		$("#main").on('click', '.hot', function() {
			window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid')
		})

		$('#today1_html').on('click', '.begin-read', function(e) {
			e.stopPropagation();
			e.cancelBubble = true;
			var parent = $(this).parents('.bookdetail')
			location.href = "chapter.html?bookid=" + parent.attr('data-bookid') + "&videoauthorid=" + parent.attr('data-videoauthorid') + "&copywriter=" + parent.attr('data-copywriter') + "&isorder=1&bookname="+parent.attr('data-bookname')+"&bookimg=" + parent.attr('data-bookimg');
		})

		$('#book_html').on('click', '.begin-read', function(e) {
			e.stopPropagation();
			e.cancelBubble = true;
			var parent = $(this).parents('.bookdetail')
			location.href = "chapter.html?bookid=" + parent.attr('data-bookid') + "&videoauthorid=" + parent.attr('data-videoauthorid') + "&copywriter=" + parent.attr('data-copywriter') + "&isorder=1&bookname="+parent.attr('data-bookname')+"&bookimg=" + parent.attr('data-bookimg');
		})

        // 好友助力点击听书
        $(document).on('click', '.voiceBook_btn', function() {
            location.href = "chapter.html?bookid=" +  $(this).attr('data-bookid') + "&videoauthorid=" +  $(this).attr('data-videoauthorid') + "&copywriter=" +  $(this).attr('data-copywriter') + "&isorder=1&bookname="+ $(this).attr('data-bookname')+"&bookimg=" +  $(this).attr('data-bookimg');
        })
        $(document).on('click', '.presenter', function() {
           location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid')
        })

        // 好友助力点击购买
        $(document).on('click', '.payment_click', function() {
             payClick(JSON.parse(window.sessionStorage.getItem("weixinData")), 2, $(this).data('bookid'), false)
        })
        // 好友助力点击分享
        $(document).on('click', '.help_click', function() {
            MtaH5.clickStat("home_share")//统计点击
            MtaH5.clickStat('haoyouzhulimian',{'homeshare':'true'})//漏斗统计
            window.location.href = "bookDetail.html?activity_type=1&bookid=" + $(this).attr('data-bookid') + "&stage=第0期&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })
		//全部听书好友助力
        $(document).on('click', '.all_btn', function(e) {
            e.stopPropagation();
            e.cancelBubble = true;
            MtaH5.clickStat("all_share")//统计点击
            window.location.href = "bookDetail.html?activity_type=1&bookid=" + $(this).attr('data-bookid') + "&stage=第0期&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })

        $("#mine").click(function() {
			location.href = "mine.html";
		})
		$("#center").click(function() {
			location.href = "info.html";
		})
		$("#x5").click(function() {
			location.href = "http://debugx5.qq.com/";
		})

		$('.free_receive_btn').click(function(){
			//恢复滑动效果
			document.body.style.overflow = 'auto';
			window.removeEventListener('touchmove', _preventDefault);
			$('.activity-alertView').addClass('hide');
			window.location.href = "activity_freeReceive.html"
		})

		$('#activity_book').on('click', '.activity_bookimg', function(e) {
			e.stopPropagation();
			e.cancelBubble = true;
			//恢复滑动效果
			document.body.style.overflow = 'auto';
			window.removeEventListener('touchmove', _preventDefault);
			$('.activity-alertView').addClass('hide');
			window.location.href = "activity_freeReceive.html";
		})

		$('.follow-mask').click(function(){
			//恢复滑动效果
			document.body.style.overflow = 'auto';
			window.removeEventListener('touchmove', _preventDefault);
			$('.activity-alertView').addClass('hide');
			$('.newUser_activity').addClass('hide');
			location.reload();
			localStorage.setItem("refresh","1");
		});

		$('.closeBtn').click(function(){
			//恢复滑动效果
			document.body.style.overflow = 'auto';
			window.removeEventListener('touchmove', _preventDefault);
			$('.activity-alertView').addClass('hide');
			$('.newUser_activity').addClass('hide');
			localStorage.setItem("refresh","1");
			location.reload();
		});

		$('.activity_newUserImgView').click(function(){
			//恢复滑动效果
			document.body.style.overflow = 'auto';
			window.removeEventListener('touchmove', _preventDefault);
			$('.activity_newUserImgView').addClass('hide');

		});

		$('.activity_Advertisement').click(function(){
			$('.activity_Advertisement').addClass('hide');
			if (advertisement_dict.type == 1) {//会员
				location.href = "memberPage.html";
			}else if (advertisement_dict.type == 2) {//精品课
				location.href = "themeDetail.html?themeId=" + advertisement_dict.id;
			}else if (advertisement_dict.type == 3) {//书单
				location.href = "listDetail.html?themeId=" + advertisement_dict.id;
			}
		});

		$('.activity_VIPImgView').click(function(){
			//恢复滑动效果
			document.body.style.overflow = 'auto';
			window.removeEventListener('touchmove', _preventDefault);
			$('.activity-alertView').addClass('hide');
			location.href="memberPage.html"
		});

		$('#tabs div').on('click',function(){
	      $('#tabs div').removeClass('active');
	      $(this).addClass('active');

	      var index = $(this).index();
	      $('.category').removeClass('hide');
		  $('.recommend').addClass('hide');

		  cateBookArr = [];
		  toast.loading({
				title: "加载中",
				duration: 2000
			});

			for (var i = 0; i < 6; i ++) {
				var id = "tab_" + i;
				if (index == i) {
					document.getElementById(id).style.color="#333";
					document.getElementById(id).style.fontWeight="bold";
				}else {
					document.getElementById(id).style.color="#999";
					document.getElementById(id).style.fontWeight="normal";
				}
			}

			var arr = ["1","11","3","9","10"];
		    var sign = hex_md5(objKeySort({token:token,timestamp:date,id:arr[index - 1],merchantId:merchantId}))

            switch (index){
	      	case 0://推荐
	      	$('.category').addClass('hide');
		    $('.recommend').removeClass('hide');
		    toast.hide();
	      		break;
	      	default://文化
	      	$.ajax({
	      			type:"get",
	      			url:hostUrl + '/home/classify/'+ token +'/'+ sign +'/'+ date +'/'+ arr[index - 1] + '/' + merchantId,
	      			// url:ascli(hostUrl + "home/classify?token=" + token + "&id=" + arr[index - 1]),
	      			async:true,
	      			success: function(data){
	      				toast.hide();
	      				if (data.status != 0) {
	      					return;
	      				}
	      				cateArr = data.data;
	      				for (var i = 0; i < cateArr.length; i ++) {
	      					cateBookArr = cateBookArr.concat(cateArr[i].bookList);
	      				}
	      				cateArr.unshift({"name":"全部","bookList":cateBookArr});
	      				data.cateArr = cateArr;
	      				document.getElementById('TopCategory').innerHTML = template("TopCategory_Item", data);
	      				document.getElementById("cate_0").style.background="#f8d44c";
                data.userVip=userVip;
                data.bookArr = cateBookArr;
				var book_html = template("book_template", data);
			    document.getElementById('book_html1').innerHTML = book_html;
	      			}
	      	});
	      		break;
	      }
		})
	})

	$('#TopCategory').on('click', '.category_btn', function(e) {
			e.stopPropagation();
			e.cancelBubble = true;
			var index = $(".category_btn").index(this);
			for (var i = 0; i < cateArr.length; i ++) {
				var id = "cate_" + i;
				document.getElementById(id).style.background="white";
			}
			this.style.background = "#f8d44c";
			cateBookArr = cateArr[index].bookList;
			var data = {};
			data.userVip=userVip;
            data.bookArr = cateBookArr;
		    var book_html = template("book_template", data);
			document.getElementById('book_html1').innerHTML = book_html;
   })

    $('.index_r').click(function () {
        if (isFollow){//订阅接口
            var signs = hex_md5(objKeySort({token: token, timestamp: date}))//查询用户是否关注或订阅签名
            $.ajax({
                type:"get",
                url: hostUrl + 'merchant/subscribe',  //查询用户是否订阅
                data:{
                    authorizerAppid:(localStorage.getItem('Cappid') =='undefined' ||localStorage.getItem('Cappid') == null) ? appId : localStorage.getItem('Cappid'),
                    token: token,
                    timestamp: date,
                    sign:signs
                },
                async:false,
                success:function(data) {
                    subscribe()
                }
            });

		}else { //没关注公众号
            $('.codeImg').attr('src',followUrl);
            $('.codebag').show()
            $('.code_box').show()
		}
    })





    //查询用户是否关注或订阅签名
    function subscribe() {
        var signs = hex_md5(objKeySort({token: token, timestamp: date}))//查询用户是否关注或订阅签名
        $.ajax({
            type:"get",
            url: hostUrl + 'merchant/subscribe/info',  //查询用户是否订阅
            data:{
                authorizerAppid:localStorage.getItem('Cappid') =='undefined' ? appId : localStorage.getItem('Cappid'),
                token: token,
                timestamp: date,
                sign:signs
            },
            async:false,
            success:function(data) {
                $('.user_img_1').text(data.data.count + '人关注');
                isSubscribe = data.data.isSubscribe;
                if(isSubscribe){
                    $('.index_r').text('取消关注')
                    $('.index_r').css('background','#eee')

                }else {
                    $('.index_r').text('关注')
                    $('.index_r').css('background','#ffda43')
                }
            }
        });
    }




$('.codebag').click(function () {
	$('.code_box').hide()
	$(this).hide()
})
	//跳转会员页面
    $('.vip_bg p').click(function () {
        location.href='memberPage.html'
    })

    $('.vip_img').click(function () {
        location.href='memberPage.html'
    })

    var isPageHide = false;
    window.addEventListener('pageshow', function () {
        if (isPageHide) {
          location.reload()
        }
    });
    window.addEventListener('pagehide', function () {
        isPageHide = true;
    });

	function _preventDefault(e){
	   e.preventDefault();
    }

    (function() {
        var mta = document.createElement("script");
        mta.src = "//pingjs.qq.com/h5/stats.js?v2.0.4";
        mta.setAttribute("name", "MTAH5");
        mta.setAttribute("sid", "500636065");
        mta.setAttribute("cid", "500636067");
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(mta, s);
    })();
</script>
